<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
		<link rel="stylesheet" href="css/lib/bootstrap.min.css" />
		<link rel="stylesheet" href="css/paging.css" />
		<script src="js/jquery.min.js"></script>
		<script src="js/lib/bootstrap.min.js"></script>
		<script src="js/lib/vue.min.js"></script>
		<script src="js/lib/vue-resource.js"></script>
		<script src="js/paging.js"></script> 
	</head>
	<style>
	
	
		td {
			border: 1px solid #eee;
			border-collapse: collapse;
			padding: 5px;
			vertical-align: middle !important;
		}		
		.btn{
			padding:2px 3px;
		}
		#tan{
			width:600px;
			height:400px;
			position:fixed;
			left:200px;
			top:50px;
			background:#000000;
			opacity: 0.8;
			z-index:1000;
			display:none;
		}
		#tantwo{
			width:600px;
			height:500px;
			position:fixed;
			left:200px;
			top:10px;
			background:#000000;
			opacity: 0.8;
			z-index:1000;
			display:none;
		}
		#tanth{
			width:600px;
			height:500px;
			position:fixed;
			left:200px;
			top:10px;
			background:#000000;
			opacity: 0.8;
			z-index:1000;
			display:none;
			border-radius:15px;
			box-shadow:1px 5px 50px 5px ;
		}
		#bbt{
			position:absolute;
			right:0;
			top:0
		}
	</style>
	<body>
		<div class="" id="box" style="position:relative;">		
		<div style="padding:15px 5px 0px 5px;border:.5px solid #ccc;margin-bottom:15px;width:100%;box-shadow:3px 5px 15px">
			<table class="table table-hover" style="width:100%;margin:0 auto">				
				<tbody>
					<tr>
						<th colspan="14" style="font-size:26px;color:#337ab7" id="btn">管理</th>
					</tr>	
						
					<tr style="font-size:15px;">
						<td colspan="14">
								<!--手机号：<input class="form-control" style="width:150px;display:inline-block" type="text" name="" id="p" v-model="ph" value="" placeholder="输入手机号查询" />-->

<button  class="btn btn-default" style="margin-left:2px;" id="insert">新建病历</button>
						</td>										
					</tr>					
					<tr class="text-center" style="font-size:13px;background:#f1f1f1;">
						<td style="width:45px">序号</td>
						<td>姓名</td>
						<td>年龄</td>
						<td>性别</td>
						<td>地址</td>
						<td>病因</td>
						<td>主治医生</td>
						<td>所属医院</td>	
						<td>就诊时间</td>	
						<td colspan="3">病例</td>	
					</tr>
					<tr  style="font-size:10px;cursor:pointer;"  data-toggle="modal" data-target="#dle1" class="text-center" v-for="(i,index) in list0" title="点击查询子任务">						
						<td style="width:30px">{{i.id}}</td>
					<!--	<td>{{i.id}}</td>-->
						<td>{{i.name}}</td>
						<td>{{i.age}}</td>
						<td>{{i.sex}}</td>
						<td>{{i.address}}</td>
						<td>{{i.diagnosis}}</td>					
						<td>{{i.reportthephysician}}</td>
						<td>{{i.reportingunit}}</td>	
						<td>{{i.create_time}}</td>	
						<td v-on:click="cha(i)"><span v-show="1" class="label label-danger">查看</span></td>	
						<td v-on:click="upt(i)"><span v-show="1" class="label label-warning">修改</span></td>	
						<td v-on:click="down(i)"><span v-show="1" class="label label-success">下载</span></td>	
						
						
					</tr>
					<tr>
						<td colspan="14" style="text-align:center;color:#ccc">--------------------------------------没有数据了-------------------------------------</td>
					</tr>
					<tr>
							<td colspan="15" class="text-center">
							第<input class="form-control" id="ye" v-model="page"  style="width:45px;display:inline-block" placeholder="1" type="text"/>页
							<button class="btn btn-default" @click="xia()">跳转</button>总共{{totalElements}}条数据    当前一共{{totalPages}}页
							<button class="btn btn-default" @click="home()">首页</button>
							<button class="btn btn-default" @click="upperpage()" >上一页</button>
							<button class="btn btn-default" @click="next()">下一页</button>
							<button class="btn btn-default" @click="last(totalPages)">尾页</button>
						</td>
					</tr>
				</tbody>
			</table>

			
		</div>
		</div>
		<div id="test" class="test"></div>
	</body>

	<script type="text/javascript">	
			/*自定义时间戳*/
		Vue.filter('time', function (value) {//value为13位的时间戳
		    function add0(m) {
		        return m < 10 ? '0' + m : m
		    }
		    var time = new Date(parseInt(value));
		    var y = time.getFullYear();
		    var m = time.getMonth() + 1;
		    var d = time.getDate();		
		    return y + '-' + add0(m) + '-' + add0(d);
		});	
		/*自定义过滤器*/	
		Vue.filter("todo2",function(value){
			if(value == 0){
				return value = " "
			}
			if(value == 1){
				return value = " "
			}
			if(value == 2){
				return value = " ×"
			}
			if(value == 3){
				return value = " "
			}
		});
	new Vue({
				el:"#box",
				data: {
					list0:[],
					list1:[],
					list:[],
					lists:[],
					token:"",
					m1:"",
					m2:"",
					m3:"",
					m4:0,
					s1:"",
					s2:"",
					s3:"",
					s4:"",
					s5:"",
					s6:"",
					ph:"",
					ye:"",
					pages:"",
					page:1,
                    i:"",
					num:"",
					ye1:1,
                    idcade:"",
					card:"",
					star:"",
					end:"",
					ss:[],
					id:"",
					ddh:"",
					executionTime:"",
					amount:"",
					rate:"",
					realAmount:"",
					payCard:"",
					userId:"",
					status:"",
					totalElements:0,
					totalPages:0,
					reportthephysician:"",
					name:"",
					phone:"",
					sex:"",
					age:"",
					pathologicaltype:"",
					conclusion:"",
					cordbase64:"",
					address:"",
				},
				created:function(){/*生命周期函数*/		
	
				    	var _this = this;
				    	/*根据手机号码查询用户id*/
				    	$.ajax({
								type:"GET",
								url:"http://localhost:8088/medicalrecords/list",
								async:false,
								dataType: "json",
								success:function(data){
									this.id = data.result.id
									_this.list0 = data.result;
									_this.totalElements = data.result.totalElements;
								},
								error:function(data){
									console.log(data)
									alert("网络错误，请稍后重试s！")
								}
						});
                        
					
				},
				methods:{
				    cardno:function(){},
				   	cha:function(i){
				   		this.ddh = i.id;
				   		var _this = this;
						$.ajax({
								type:"GET",
								url:"http://localhost:8088/medicalrecords/"+this.ddh,
								async:false,
								dataType: "json",
								success:function(data){
									_this.list = data.result;
									document.getElementById("test").innerHTML = "<div class='new'><img src="+data.result[0].cordbase64+" alt=''/></div>";
								},
								error:function(data){
									console.log(data)
									alert("网络错误，请稍后重试s！")
								}
						});
				   	},
				   	//修改
				   	 	upt:function(i){
				   	 		this.ddh = i.id;
				   	 			this.reportthephysician = i.reportthephysician,
								this.name = i.name,
								this.phone = i.phone,
								this.sex = i.sex,
								this.age = i.age,
								this.pathologicaltype = i.pathologicaltype,
								this.conclusion = i.conclusion,
								this.cordbase64 = i.cordbase64,
								this.address = i.address,
//				   		encodeURI(url)
				   	 	window.location.href=encodeURI("update.html?reportthephysician="+this.reportthephysician+'&name='+this.name+'&phone='+this.phone+'&sex='+this.sex+'&age='+this.age+'&pathologicaltype='+this.pathologicaltype+'&conclusion='+this.conclusion+'&cordbase64='+this.cordbase64+'&address='+this.address+'&id='+this.ddh);
				   	},
				   	//下载
				   		down:function(i){
				   	 	this.ddh = i.id;
				   		var _this = this;
						$.ajax({
								type:"GET",
								url:"http://localhost:8088/medicalrecords/download/"+this.ddh,
								async:false,
								dataType: "json",
								success:function(data){
									alert("下载成功，请移植桌面查看");
								},
								error:function(data){
									console.log(data)
									alert("网络错误，请稍后重试！")
								}
						});
				   	},
				   	       home(){
				          	if(this.page==1){
								alert("已经是第一页了吆")
								return
							}
				          	this.page=1
				          	this.cardno();
				          },
				          next(){
				         	if(this.page>=this.totalPages){
								alert("已经是最后一页了吆")
								return
							}
							this.page=Number(this.page)+1;
							this.cardno();
				          },
				          upperpage(){
				          if(this.page == 1){
								alert("已经是第一页了吆")
								return
							};
							 this.page-=1;
							 this.cardno();
				 
				          },
				          last(e){
				          	this.page=e
				          	 this.cardno();
				          },
				          xia(){
				          	
				          	this.cardno();
				          },				   
                      
					}					
				
			})			
</script>


<script>
	$(function() {
			$('#insert').click(function() {
				window.location.href="insertmedicalrecords.html"
			})
			
	});
</script>


<script>
	$(function() {
			
			
	});
</script>
</html>

